import { Layout, Menu , Row, Col,Tabs} from "antd";
import {
  UserOutlined,
  VideoCameraOutlined,
  UploadOutlined,
} from "@ant-design/icons";
import {  Link, Routes, Route } from "react-router-dom";
import Detail from "../Detail";
// import ListCui from "../CuiManage/List";
import ShopManageDetail from "../ShopManage/Detail";
import CuiList from "../CuiManage/List";
import ShopManageList from "../ShopManage/List";
import ShopManageAddShop from "../ShopManage/AddShop";
import ShopManageEditShop from "../ShopManage/EditShop";
import AddCui from "../CuiManage/AddCui";
import EditCui from "../CuiManage/EditCui";
import OrderList from "../OrderManage/List";
import OrderPlace from "../OrderManage/Place";
import OrderMake from "../OrderManage/Make";
import OrderProduce from "../OrderManage/Produce";
import OrderBill from "../OrderManage/Bill";
import OrderCheck from "../OrderManage/Check";
import OrderAdjust from "../OrderManage/Adjust";
import "./index.css"


const { TabPane } = Tabs;

const { Header, Sider, Content } = Layout;

export default function Home() {
  return (
    <Layout>
            <Header
          className="site-layout-background"
          style={{ padding: 0,height:100,background:'white' }}
        >
          <Row style={{ height:80}}>
            <Col span={4} className="bgImg" ></Col>
            <Col span={12} style={{ marginTop:20,left:100}}>
            <Tabs defaultActiveKey="1">
            <TabPane tab="运营中心" key="1">
            </TabPane>
            <TabPane tab="营销中心" key="2">
            </TabPane>
            <TabPane tab="会员中心" key="3">
            </TabPane>
            <TabPane tab="库存中心" key="4">
            </TabPane>
            <TabPane tab="报表中心" key="5">
            </TabPane>
            </Tabs>
            </Col>
            <Col span={8}>
            </Col>
          </Row>
        </Header>
        <Layout>
        <Sider
        trigger={null}
        collapsible
        collapsed={false}
        style={{ height: "100vh" }}
        width={300}
      >
        <div className="logo" />
        <Menu theme="dark" mode="inline" defaultSelectedKeys={["1"]}
        className="menuOp"
        >
          <Menu.Item key="2" icon={<UserOutlined />}
          style={{height:70}}
          >
            <Link to="/poi-manage/list"   className="allStyle">门店管理</Link>
          </Menu.Item>
          <Menu.Item key="3" icon={<VideoCameraOutlined />}
          style={{ height:70}}
         
          >
            <Link to="/cui-manage/cuiList"  className="allStyle">菜品管理</Link>
          </Menu.Item>
          <Menu.Item key="4" icon={<UploadOutlined />}
          style={{ height:70}}
         
          >
            <Link to="/order/list"  className="allStyle">订单管理</Link>
          </Menu.Item>
        </Menu>
      </Sider>
      <Layout className="site-layout">
  
        <Content
          className="site-layout-background homeBroder"
          style={{
            margin: "24px 16px",
            padding: 24,
            minHeight: 280,
            background:'#fdfcfc',                      
          }}
        >
          <Routes>
            <Route path="/" element={<Detail/>} />
            <Route path="/order">
              <Route path="list" element={<OrderList/>}></Route>
              <Route path="place" element={<OrderPlace/>}></Route>
              <Route path="make" element={<OrderMake/>}></Route>
              <Route path="produce" element={<OrderProduce/>}></Route>
              <Route path="bill" element={<OrderBill/>}></Route>
              <Route path="check" element={<OrderCheck/>}></Route>
              <Route path="adjust" element={<OrderAdjust/>}></Route>
            </Route>
            <Route path="/cui-manage">
              <Route path="cuiList" element={<CuiList />} />
              <Route path="addCui" element={<AddCui />} />
              <Route path="editCui" element={<EditCui />} />
            </Route>
            <Route path="/poi-manage">
              <Route path="detail" element={<ShopManageDetail />} />
              <Route path="list" element={<ShopManageList />} />
              <Route path="addShop" element={<ShopManageAddShop />} />
              <Route path="editShop" element={<ShopManageEditShop />} />
              <Route path="addCui" element={<AddCui />} />
            </Route>
          </Routes>
        </Content>

        </Layout>
      
      </Layout>
    </Layout>
  );
}
